import React, { PropsWithChildren } from 'react';
import { List } from 'antd-mobile';
import { connect } from 'react-redux';
import { RouteComponentProps } from 'react-router-dom';
import { CombinedState, HomeState } from '../../typings';
import mapDispatchToProps from '../../store/actions/home';

const { Item } = List;
const mapStateToProps = (state: CombinedState): HomeState => state.home;

type Props = PropsWithChildren<
RouteComponentProps & ReturnType<typeof mapStateToProps> & typeof mapDispatchToProps
>;

function Home(props: Props) {
  return (
    <>
      <List renderHeader={() => ''}>
        <Item onClick={() => props.history.push('/pic')}>选择图片</Item>
        <Item onClick={() => props.history.push('/auth')}>根据授权码获取用户信息</Item>
        <Item onClick={() => props.history.push('/location')}>获取定位信息</Item>
        <Item onClick={() => props.history.push('/device')}>设备信息</Item>
      </List>
    </>
  );
}

export default connect(mapStateToProps, mapDispatchToProps)(Home);
